<template>
	<view>
		<u-card :title="'客户总数：'+userTotal+'人'" title-color="#9e9e9e" :head-style="{borderBottom:'1rpx solid #f0f0f0'}">
			<view class="" slot="body">
				<view class="user-item" v-for="(user,index) in userInfoList" :key="index" @click="copyUserMobile(user)">
					<u-avatar size="large" :src="user.avatar"></u-avatar>
					<view class="user-info">
						<view class="user-name">昵称：{{user.nickname}}</view>
						<view class="user-mobile">手机号：<text class="user-mobile-text">{{user.mobile}}</text></view>
						<view class="user-last-logintime">注册时间：{{$u.timeFormat(user.register_date, 'yyyy-mm-dd hh:MM')}}
						</view>
						<view class="user-register-time">
							最后登录时间：{{$u.timeFormat(user.last_login_date, 'yyyy-mm-dd hh:MM')}}</view>
					</view>
				</view>
			</view>
			<view class="user-foot" slot="foot"><u-icon name="error" size="34" color="#fa3534" label-color="#fa3534"
					label="请不要外传客户信息"></u-icon></view>
		</u-card>
	</view>
</template>

<script>
	import {
		mapState
	} from 'vuex';
	export default {
		name: "user-manager",
		props:['userTotal','userInfoList'],
		data() {
			return {

			};
		},
		computed: {
			
		},
		methods: {
			change(index) {
				this.current = index;
			},
			copyUserMobile(user) {
				uni.setClipboardData({
					data: user.mobile,
					showToast: true,
					success: function() {

					}
				});
			}
		}
	}
</script>

<style scoped lang="scss">
.user-item{
	display: flex;
	align-items: center;
	padding: 15rpx 0;
	border-bottom:1rpx solid #f0f0f0;
	.user-info{
		display: flex;
		flex-direction: column;
		margin-left: 20rpx;
		color: #9e9e9e;
		font-size: 18rpx;
		.user-mobile{
			.user-mobile-text{
				color:#fa3534;
				font-size: 26rpx;
			}
			
		}
	}
}
.user-foot{
	// padding-top: 0;
	// border-top: 1px solid #f0f0f0;
}
</style>